<template>
	<view>
		<view class="aboutUs">
			<view class="iconBig">
				<image src="http://106.14.56.171:15016/images/Smallicons/redLogin.png" mode=""></image>
				<h2>ePumping</h2>
				<!-- #ifdef APP-PLUS || H5 -->
				<text>{{version}}</text>
				<!-- #endif -->
				<!-- #ifdef MP-WEIXIN  -->
				<text>{{weiverName}}</text>
				<!-- #endif -->
			</view>

			<view class="firmBrief">
				<text>
					易乓乒ePumping是上海易乓乒智能科技股份有限公司自主研发的综合工业服务平台，该平台旨在打造更加高效、透明的工业服务模式，让服务企业的员工工作更加高效、更加规范，同时让服务的购买方更加放心、更加省心，平台以这种全新的服务模式搭建起服务上下游企业间业务流转的快速通道，促进行业间互利共赢。
				</text>
			</view>
		</view>
		<!-- 点击注销账号跳转到首页 -->
		<view class="abouText" @click="cancelAccount"><text>注销账号</text></view>
		<uni-popup ref="popupT" type="center">
			<view class="canceAccount">
				<view class="canceText">
					<h3>您的申请已收到</h3>
					<h3>审核通过后将自行注销</h3>
				</view>
				<view class="popBox">
					<view @click="canceLogout">取消</view>
					<view class="popBoxActive" @click="gotoIndex">确定</view>
				</view>
			</view>
		</uni-popup>

	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		data() {
			return {
				version: '', // 版本号
				weiverName: ''
			};
		},
		computed: {
			...mapState(['userInfo'])
		},
		onLoad() {
			this.weiverName = getApp().globalData.weiverName
			let version = uni.getStorageSync('app-version')
			// console.log(version, '5555');
			if (version) this.version = version
		},
		methods: {
			gotoIndex() {
				// 点击注销账号跳转到登录页
				this.$http.get('api/auth/accountLogout').then(res => {
					console.log(res);
					if (res = null) {
						this.emptyUserInfo(); // 非常重要

						uni.showToast({
							title: '注销账号成功',
							icon: 'none'
						});

					}
				});
				uni.navigateTo({
					url: './../login/login'
				});

			},
			// 是否注销账号 打开弹出层
			cancelAccount() {
				this.$refs.popupT.open('center')
			},
			// 关闭弹框
			canceLogout() {
				this.$refs.popupT.close('center')
			}
		}
	};
</script>

<style scoped lang="less">
	.aboutUs {
		width: 95%;
		height: 1218rpx;
		background-color: #fff;
		border-radius: 28rpx;
		margin: auto;
		margin-top: 40rpx;
	}

	.iconBig {
		width: 90%;
		height: 400rpx;
		border-bottom: 1px solid #f5f5f5;
		display: flex;
		align-items: center; //左右居中
		flex-direction: column; //竖向布局垂直居中
		justify-content: center;
		margin: auto;
		/* background-color: antiquewhite; */
	}

	.iconBig image {
		width: 218rpx;
		height: 218rpx;
	}

	.iconBig h2 {
		position: relative;
		top: 28rpx;
	}

	.iconBig text {
		position: relative;
		top: 38rpx;
	}

	.firmBrief {
		width: 90%;
		margin: auto;
		position: relative;
		top: 28rpx;
		text-indent: 2em;
	}

	.abouText {
		margin-top: 28rpx;
		width: 100%;
		height: 88rpx;
		line-height: 88rpx;
		background-color: #fff;
		text-align: center;
	}

	/* 是否注销账号 */
	.canceAccount {
		width: 500rpx;
		height: 300rpx;
		border-radius: 20rpx;
		background-color: #FFFFFF;
		/* margin: auto; */
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.canceText {
		width: 100%;
		height: 100rpx;
		/* background-color: aqua; */
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
	}

	.popBox {
		margin-top: 50rpx;
		width: 80%;
		display: flex;
		justify-content: space-between;

		>view {
			width: 180rpx;
			height: 80rpx;
			background-color: #F9F9F9;
			text-align: center;
			line-height: 80rpx;
			border-radius: 90rpx;
		}

		>view:nth-child(2) {
			color: #B5001E;
		}

		.popBoxActive:active {
			background-color: #B5001E;
			color: #FFFFFF;
		}
	}
</style>